<template>
  <div>
    <div class="ana-title">
      <a-icon class="ana-title-icon" type="bar-chart" /><span
        class="ana-title-txt"
        >时间分布</span
      >
    </div>
    <div class="ana-content">
      <time-distribute
        class="ana-content-item"
        style="width: 50%"
        :chartData="dataSource"
      />
      <time-distribute-1 :chartData="dataSource" style="width: 50%" class="ana-content-item" />
    </div>
    <div class="ana-title">
      <a-icon
        class="ana-title-icon"
        type="bar-chart"
      /><span class="ana-title-txt">人群分布</span>
    </div>
    <div class="ana-content">
      <age-distribute class="ana-content-item" style="width: 25%" :chartData="dataSource" :defaultKey="'性别'" />
      <op-distribute class="ana-content-item" style="width: 25%" :chartData="dataSource" />
      <sex-distribute class="ana-content-item" style="width: 25%" :chartData="dataSource" />
      <yuhou-distribute class="ana-content-item" style="width: 25%" :chartData="dataSource" />
    </div>
    <div class="ana-title">
      <a-icon class="ana-title-icon" type="global" /><span
        class="ana-title-txt"
        >地区分布</span
      >
    </div>
    <div class="ana-content">
      <space-distribute class="ana-content-item" style="width: 50%"  :chartData="dataSource" />
      <space-distribute-1 class="ana-content-item" style="width: 50%"  :chartData="dataSource" />
    </div>
<!--     
    <div class="ana-content">
      <h2>其它</h2>
      <comm-distribute
        :chartData="dataSource"
        :defaultKey="'身高（cm）'"
        :width="600"
      />
    </div> -->
  </div>
</template>

<script>
import CommDistribute from "../charts/CommDistribute.vue";
import SpaceDistribute from "../charts/SpaceDistribute.vue";
import TimeDistribute from "../charts/TimeDistribute.vue";
import AgeDistribute from "../charts/AgeDistribute.vue";
import TimeDistribute1 from '../charts/TimeDistribute1.vue';
import OpDistribute from '../charts/OpDistribute.vue';
import YuhouDistribute from '../charts/YuhouDistribute.vue';
import SexDistribute from '../charts/SexDistribute.vue';
import SpaceDistribute1 from '../charts/SpaceDistribute1.vue';
export default {
  components: {
    TimeDistribute,
    SpaceDistribute,
    CommDistribute,
    AgeDistribute,
    TimeDistribute1,
    OpDistribute,
    YuhouDistribute,
    SexDistribute,
    SpaceDistribute1
  },
  props: {
    dataSource: Array,
  },
};
</script>

<style>

</style>